<div style="width: 800px; height: 100px; text-align: center; line-height: 100px;"><a href="#" onclick="moveMap(0,600);">Move Up</a></div>
<div style="width: 100px; height: 600px; line-height: 600px; text-align: center; float: left;"><a href="#" onclick="moveMap(600,0);">Move Left</a></div>
<div style="width: 600px; height: 600px; overflow: hidden; position: relative; border: solid 1px #000; float: left;">
<div style="position: relative; width: 4000px; height: 3000px;" id="mapDiv">
<table width="4000px;" cellpadding="0" cellspacing="1" border="0">
  <% @world.zones.each do |zone| %>
    <% if zone.zone_num % 100 == 1 %><tr><% end %>
      <% if zone.zone_type == 'forest'
				style='color: green;'
			else
				style='color: red;'
			end %>
      <td style="width: 40px; height: 40px; border: solid 1px #000;"><%= link_to zone.id, {:controller => 'zone', :action => 'show', :id => zone.id}, {:style => style} %></td>
    <% if zone.zone_num % 100 == 0 %></tr><% end %>
  <% end %>
</table>
</div>
</div>

<div style="width: 100px; height: 600px; line-height: 600px; text-align: center; float: left;"><a href="#" onclick="moveMap(-600,0);">Move Right</a></div>
<div style="width: 800px; height: 100px; text-align: center; line-height: 100px; clear: both;"><a href="#" onclick="moveMap(0,-600);">Move Down</a></div>
<script type="text/javascript">
currenttop = 0;
currentleft = 0;
function moveMap(left,top) {
  if ((currenttop + top) > 0) {
    currenttop = 0;
  } else if ((currenttop + top) < ((4000 - 600) * -1)) {
    currenttop = (4000 - 600) * -1;
  } else {
    currenttop = currenttop + top;
  }
  if ((currentleft + left) > 0) {
    currentleft = 0;
  } else if ((currentleft + left) < ((4000 - 600) * -1)) {
    currentleft = (4000 - 600) * -1;
  } else {
    currentleft = currentleft + left;
  }
  document.getElementById('mapDiv').style.top = currenttop;
  document.getElementById('mapDiv').style.left = currentleft;
}
</script>
<%
  number = 1191
	mysquare = {}
	mysquare = {:left => (((number - (((number / 100).to_i) * 100)) - 8) * 40 * -1), :top => (((number / 100).to_i - 7) * 40 * -1)}
%>
<script type="text/javascript">
moveMap(<%= mysquare[:left] %>,<%= mysquare[:top] %>);
</script>